import React, { Component, PropTypes } from 'react';
import Todo from './Todo';

export default class TodoList extends Component{
    render(){
        return (
            <ul>
                {this.props.todos.map( todo => 
                    <Todo {...todo}
                    key={todo.id}
                    onClick={() => this.props.onTodoClick(todo.id)} />
                )}
            </ul>
        );
    }
}
TodoList.propTypes = {
    onTodoClick: PropTypes.func.isRequired,
    todos: PropTypes.arrayOf(PropTypes.shape({
        text: PropTypes.string.isRequired,
        completed: PropTypes.bool.isRequired
    }).isRequired).isRequired
}